import React, { Component } from "react";
import axios from "../../../http/request";
import '../serve.scss'
import '../../../assest/iconfont/icon.css'
class index extends Component {
  state = {
    datas: [],
  };
  componentDidMount() {
    axios.get("reader-service/buy-book").then((res) => {
      console.log(res.data);
      this.setState({
        datas: res.data,
      });
    });
  }
  gotoShop(url) {
    window.location.href = url;
  }
  render() {
    return (
      <div className='wrapper'>
        <div className='header'>
          <div className='left' onClick={() => {this.onLeftClick()}}>
            <i className='iconfont iconzuojiantou'></i>
          </div>
        </div>
        {this.state.datas.map((item) => {
          return (
            <div
              className="service-choice-item"
              key={item.id}
              onClick={() => {
                this.gotoShop(item.url);
              }}
            >
              <div className="service-choice-left">
                <img src={item.logo} alt="" />
              </div>
              <div className="service-item-center">
                <h2>{item.name}</h2>
              </div>
              <div className="service-item-right">
                <i className="iconfont icon-arr-right"></i>
              </div>
            </div>
          );
        })}
      </div>
    );
  }
  onLeftClick(){
    window.history.back()
  }
}

export default index;
